<template lang="html">
    <div>
        <div class="L1-head">
            辖区概览
        </div>
        <div style="margin-top: 20px;">
            <table class="data-t-xq">
            <tr class="titleIndex">
                <th>
                    <img src="../../../static/IMG/责任区.png" /></th>
                <td>
                    <p>责任区</p>
                    <p><span>7</span>个</p>
                </td>
                <th>
                    <img src="../../../static/IMG/小区.png" /></th>
                <td onclick="Zhxq.queryXqxxs('')">
                    <p>小区</p>
                    <p><span id="xqzs">116</span>个</p>
                </td>
                <th>
                    <img src="../../../static/IMG/街路巷.png" /></th>
                <td>
                    <p>街路巷</p>
                    <p><span>17</span>条</p>
                </td>
            </tr>
            <tr class="titleIndex">
                <th>
                    <img src="../../../static/IMG/建筑物.png" /></th>
                <td>
                    <p>长途客车</p>
                    <p><span id="jzwId">3</span>辆</p>
                </td>
                <th>
                    <img src="../../../static/IMG/实有房屋.png" /></th>
                <td>
                    <p>建筑物</p>
                    <p><span id="syfwId">528</span>幢</p>
                </td>
                <th>
                    <img src="../../../static/IMG/实有人口.png" /></th>
                <td>
                    <p>感知设备</p>
                    <p><span id="syrkId">52</span>个</p>
                </td>
            </tr>
            <tr class="titleIndex">
                <th>
                    <img src="../../../static/IMG/实有单位.png" /></th>
                <td>
                    <p>公交车</p>
                    <p><span>27</span>辆</p>
                </td>
                <th>
                    <img src="../../../static/IMG/视频监控.png" /></th>
                <td>
                    <p>货运车辆</p>
                    <p><span id="jkId">4569</span>辆</p>
                </td>
                <th>
                    <img src="../../../static/IMG/街路巷.png" /></th>
                <td>
                    <p>出租车</p>
                    <p><span>60</span>辆</p>
                </td>
            </tr>
        </table>
        </div>
    </div>
</template>
<script>
import Vue from "vue";
export default {
  data() {
    return {
      options: {},
    };
  },
  props: {},
  computed: {},
  components: {},
  created: function () {},
  mounted() {},
  watch: {},
  methods: {},
};
</script>
<style scoped>
.L1-head {
  font-size: 30px;
  color: #0096ff;
  margin-left: 40px;
  margin-top: 20px;
  font-weight: bolder;
  font-style: italic;
}
.data-t-xq {
    height: 220px;
    margin-left: 20px;
}
.titleIndex {
    height: 70px;
}
td{
    font-size: 20px;
    color: white;
    padding-left: 10px;
}
td p:first-child{
    padding-bottom: 10px;
}
td p:nth-child(2) span{
    color: yellow;
    font-size: 30px;
}
</style>